<!doctype html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<title>Auddly Music</title>
	<meta name="description" content="Auddly Music Streaming App">
	<meta name="keyword" content="Auddly Music | Streaming App | Self hosted">
	<meta name="author" content="Auddly">
	<base href="/">
	<!--meta name="viewport"
		content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no; viewport-fit=cover" /-->
	<!--meta name="viewport"
		content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no" /-->

	<meta name="viewport"
		content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">

	<meta name="apple-mobile-web-app-status-bar-style" content="default">
	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
	<link rel="manifest" href="/manifest.webmanifest">
	<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#4d7b88">
	<meta name="msapplication-TileColor" content="#3ec7c2">
	<script src="https://unpkg.com/phosphor-icons"></script>

	<link href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Round"
		rel="stylesheet">
	<link rel="manifest" href="manifest.webmanifest">
	<meta name="theme-color" content="#000000">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.8.0/chart.min.js"
		integrity="sha512-sW/w8s4RWTdFFSduOTGtk4isV1+190E/GghVffMA9XczdJ2MDzSzLEubKAs5h0wzgSJOQTRYyaz73L3d6RtJSg=="
		crossorigin="anonymous" referrerpolicy="no-referrer"></script>
	<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>

</head>

<body>
	<app-root></app-root>
	<noscript>Please enable JavaScript to continue using this application.</noscript>
	<script>
		function touchHandler(event) {
			var touches = event.changedTouches,
				first = touches[0],
				type = "";
			switch (event.type) {
				case "touchstart": type = "mousedown"; break;
				case "touchmove": type = "mousemove"; break;
				case "touchend": type = "mouseup"; break;
				default: return;
			}

			var simulatedEvent = document.createEvent("MouseEvent");
			simulatedEvent.initMouseEvent(type, true, true, window, 1,
				first.screenX, first.screenY,
				first.clientX, first.clientY, false,
				false, false, false, 0/*left*/, null);
			first.target.dispatchEvent(simulatedEvent);
			event.preventDefault();
		}

		function init() {
			document.addEventListener("touchstart", touchHandler, true);
			document.addEventListener("touchmove", touchHandler, true);
			document.addEventListener("touchend", touchHandler, true);
			document.addEventListener("touchcancel", touchHandler, true);
		} 
	</script>
</body>

</html>